<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>问答系统首页</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="keywords" content="">
	<meta name="description" content="">
	<link rel="stylesheet" href="__BBS_Module__/layui/css/layui.css">
	<link rel="stylesheet" href="__BBS_Module__/css/global.css">
	<script src="__BBS_Module__/layui/layui.js"></script>
	<script src="/public/jquery/jquery-3.3.1.min.js"></script>
	<link rel="stylesheet" href="/public/bootstrap-4.0.0-dist/css/bootstrap.min.css">
	<script src="/public/bootstrap-4.0.0-dist/js/bootstrap.min.js"></script>
</head>

<body>
	{$head}

	<div class="global bm_c bootstarp4 wrap">
		<div class="bootstarp4 row">
			<div class="global main bootstarp4 card">
				<div class="bootstarp4 card-header">
					<ul class="bootstarp4 nav nav-pills justify-content-center" id="myTab" role="tablist">
						<li class="bootstarp4 nav-item">
							<a class="bootstarp4 nav-link active" id="task-tab" data-toggle="tab" href="#task"
								role="tab" aria-controls="task" aria-selected="true">任务</a>
						</li>
						<li class="bootstarp4 nav-item">
							<a class="bootstarp4 nav-link" id="task-info-tab" data-toggle="tab" href="#task-info"
								role="tab" aria-controls="task-info" aria-selected="false">任务详情</a>
						</li>
						<li class="bootstarp4 nav-item">
							<a class="bootstarp4 nav-link" onclick='integral_query()' id="Integral-query-tab"
								data-toggle="tab" href="#Integral-query" role="tab" aria-controls="Integral-query"
								aria-selected="false">积分查询</a>
						</li>
					</ul>
				</div>
				<div class="bootstarp4 card-body">

					<div class="bootstarp4 tab-content" id="myTabContent">
						<div class="bootstarp4 tab-pane fade show active" id="task" role="tabpanel"
							aria-labelledby="task-tab">
							<!-- 任务 -->

							<div class="bootstarp4 bd-example bd-example-tabs">
								<div class="bootstarp4 row">
									<div class="bootstarp4 text-center col-3">
										<div class="bootstarp4 nav flex-column nav-pills" id="v-pills-tab"
											role="tablist" aria-orientation="vertical">
											<a class="bootstarp4 nav-link active show" id="mission-unanswered-tab"
												data-toggle="pill" href="#mission-unanswered" role="tab"
												aria-controls="mission-unanswered" aria-selected="true">未接任务</a>
											<a class="bootstarp4 nav-link" id="ongoing-tasks-tab" data-toggle="pill"
												href="#ongoing-tasks" role="tab" aria-controls="ongoing-tasks"
												aria-selected="false">进行中任务</a>
											<a class="bootstarp4 nav-link" id="completed-tasks-tab" data-toggle="pill"
												href="#completed-tasks" role="tab" aria-controls="completed-tasks"
												aria-selected="false">已完成任务</a>
											<a class="bootstarp4 nav-link" id="mission-of-failure-tab"
												data-toggle="pill" href="#mission-of-failure" role="tab"
												aria-controls="mission-of-failure" aria-selected="false">失败的任务</a>
											<a class="bootstarp4 nav-link" id="mission-failure-tab" data-toggle="pill"
												href="#mission-failure" role="tab" aria-controls="mission-failure"
												aria-selected="false">异常的任务</a>
										</div>
									</div>
									<div class="bootstarp4 col-9">
										<div class="bootstarp4 tab-content" id="v-pills-tabContent">
											<div class="bootstarp4 tab-pane fade active show" id="mission-unanswered"
												role="tabpanel" aria-labelledby="mission-unanswered-tab">
												<!-- 未接任务 -->


												{volist name='$mission_unanswere' id='vo'}
												<div id='mission_unanswere_{$vo.id}_div' class="bootstarp4 row">
													<div class="bootstarp4 col-2">
														<img width="100px" height="100px"
															src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">
													</div>
													<div class="bootstarp4 col-8">
														<td>
															<a id='mission_unanswere_{$vo.id}_href'
																href='{if condition="($vo.type == 0)"}{$vo.extended_task_links}{else \}{:url("bbs/readarticle/index")}?id={$vo.article_id}{/if}'>
																{if condition="($vo.type == 0)"}
																[扩展任务]
																{else \}
																[回复任务]
																{/if}
																{$vo.task_name}</a> <span>(人气: <a
																	href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>
																)</span>
															<p>{$vo.mission_statement}</p>
															<div class="bootstarp4 progress">
																<div id='mission_unanswere_{$vo.id}_progress'
																	class="bootstarp4 progress-bar" role="progressbar"
																	style="width: 0%" aria-valuemax="100"></div>
															</div>
														</td>
													</div>
													<div class="bootstarp4 col-2 m-auto text-center">
														<button id='mission_unanswere_{$vo.id}_button' type="button"
															onclick="receiving_tasks('{$vo.id}')"
															class="bootstarp4 btn btn-primary">领取任务</button>
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">查看详情</button>
													</div>
												</div>
												<br>
												{/volist}
												
											</div>
											<div class="bootstarp4 tab-pane fade" id="ongoing-tasks" role="tabpanel"
												aria-labelledby="ongoing-tasks-tab">
												<!-- 进行中任务 -->
												{volist name='$ongoing_tasks' id='vo'}
												<div id='ongoing_tasks_{$vo.id}_div' class="bootstarp4 row">
													<div class="bootstarp4 col-2">
														<img width="100px" height="100px"
															src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">
													</div>
													<div class="bootstarp4 col-8">
														<td>
															<a
																href='{if condition="($vo.type == 0)"}{$vo.extended_task_links}{else \}{:url("bbs/readarticle/index")}?id={$vo.article_id}{/if}'>
																{if condition="($vo.type == 0)"}
																[扩展任务]
																{else \}
																[回复任务]
																{/if}
																{$vo.task_name}</a> <span>(人气: <a
																	href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>
																)</span>
															<p>{$vo.mission_statement}</p>
															{if condition="($vo.start == 1)"}
															<div class="bootstarp4 progress">
																<div class="bootstarp4 progress-bar" role="progressbar"
																	style="width: 50%" aria-valuemax="100">50%</div>
															</div>
															{else \}
															{if condition="($vo.start == 2)"}
															<div class="bootstarp4 progress">
																<div class="bootstarp4 progress-bar  bg-info"
																	role="progressbar" style="width: 100%"
																	aria-valuemax="100">100%</div>
															</div>
															{/if}
															{/if}
														</td>
													</div>
													<div class="bootstarp4 col-2 m-auto text-center">
														{if condition="($vo.start == 1)"}
														{if condition="($vo.type == 0)"}
														<button type="button"
															onclick="window.location.href='{$vo.extended_task_links}'"
															class="bootstarp4 btn btn-primary">执行任务</button>
														{else \}
														<button type="button"
															onclick="window.location.href='{:url(\'bbs/readarticle/index\')}?id={$vo.article_id}'"
															class="bootstarp4 btn btn-primary">执行任务</button>

														{/if}
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">查看详情</button>
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">放弃任务</button>
														{else \}
														{if condition="($vo.start == 2)"}
														<button type="button" onclick="Reward('{$vo.id}')"
															class="bootstarp4 btn btn-primary">领取奖励</button>
														{/if}
														{/if}
													</div>
												</div>
												<br>
												{/volist}
											</div>
											<div class="bootstarp4 tab-pane fade" id="completed-tasks" role="tabpanel"
												aria-labelledby="completed-tasks-tab">
												<!-- 已完成任务 -->
												{volist name='$completed_tasks' id='vo'}
												<div class="bootstarp4 row">
													<div class="bootstarp4 col-2">
														<img width="100px" height="100px"
															src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">
													</div>
													<div class="bootstarp4 col-8">
														<td>
															<a href='
																	{if condition="($vo.type == 0)"}
																	{$vo.extended_task_links}
																	{else \}
																	{:url("bbs/readarticle/index")}?id={$vo.article_id}
																	{/if}

																	'>
																{if condition="($vo.type == 0)"}
																[扩展任务]
																{else \}
																[回复任务]
																{/if}
																{$vo.task_name}</a> <span>(人气: <a
																	href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>
																)</span>
															<p>{$vo.mission_statement}</p>
															<div class="bootstarp4 progress">
																<div class="bootstarp4 progress-bar  bg-success"
																	role="progressbar" style="width: 100%"
																	aria-valuemax="100">100%</div>
															</div>
														</td>
													</div>
													<div class="bootstarp4 col-2 m-auto text-center">
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">查看详情</button>
													</div>
												</div>
												<br>
												{/volist}
											</div>
											<div class="bootstarp4 tab-pane fade" id="mission-of-failure"
												role="tabpanel" aria-labelledby="mission-of-failure-tab">
												<!-- 失败的任务 -->
												{volist name='$mission_failure' id='vo'}
												<div class="bootstarp4 row">
													<div class="bootstarp4 col-2">
														<img width="100px" height="100px"
															src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">
													</div>
													<div class="bootstarp4 col-8">
														<td>
															<a href='
																	{if condition="($vo.type == 0)"}
																	{$vo.extended_task_links}
																	{else \}
																	{:url("bbs/readarticle/index")}?id={$vo.article_id}
																	{/if}

																	'>
																{if condition="($vo.type == 0)"}
																[扩展任务]
																{else \}
																[回复任务]
																{/if}
																{$vo.task_name}</a> <span>(人气: <a
																	href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>
																)</span>
															<p>{$vo.mission_statement}</p>
															<div class="bootstarp4 progress">
																<div class="bootstarp4 progress-bar  bg-warning"
																	role="progressbar" style="width: 100%"
																	aria-valuemax="100">0%</div>
															</div>
														</td>
													</div>
													<div class="bootstarp4 col-2 m-auto text-center">
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">查看详情</button>
													</div>
												</div>
												<br>
												{/volist}
											</div>
											<div class="bootstarp4 tab-pane fade" id="mission-failure" role="tabpanel"
												aria-labelledby="mission-failure-tab">
												<!-- 异常的任务 -->
												{volist name='$task_exception' id='vo'}
												<div class="bootstarp4 row">
													<div class="bootstarp4 col-2">
														<img width="100px" height="100px"
															src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">
													</div>
													<div class="bootstarp4 col-8">
														<td>
															<a href='
																	{if condition="($vo.type == 0)"}
																	{$vo.extended_task_links}
																	{else \}
																	{:url("bbs/readarticle/index")}?id={$vo.article_id}
																	{/if}

																	'>
																{if condition="($vo.type == 0)"}
																[扩展任务]
																{else \}
																[回复任务]
																{/if}
																{$vo.task_name}</a> <span>(人气: <a
																	href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>
																)</span>
															<p>{$vo.mission_statement}</p>
															<div class="bootstarp4 progress">
																<div class="bootstarp4 progress-bar  bg-danger"
																	role="progressbar" style="width: 100%"
																	aria-valuemax="100">0%</div>
															</div>
														</td>
													</div>
													<div class="bootstarp4 col-2 m-auto text-center">
														<button type="button" onclick="info('{$vo.id}')"
															class="bootstarp4 btn btn-primary">查看详情</button>
													</div>
												</div>
												<br>
												{/volist}
											</div>
										</div>
									</div>
								</div>
							</div>
							<script>
								function info(id) {
									// 查看详情
									$('#task-tab').attr('class', 'bootstarp4 nav-link');
									$('#task-info-tab').attr('class', 'bootstarp4 nav-link active');
									$('#task').attr('class', 'bootstarp4 tab-pane fade');
									$('#task-info').attr('class', 'bootstarp4 tab-pane fade active show');

									$.ajax({
										type: "POST",
										url: "{:url('bbs/task/task_index_info')}",
										data: {
											id: id
										},
										dataType: "JSON",
										success: function (response) {
											if (response.data.type == 0) {
												href = response.data.extended_task_links;
												type = '扩展任务';
											} else {
												href = '{:url("/bbs/readarticle/index")}?id=' + response.data.id
												type = '回复任务';
											}
											html = '<div class="bootstarp4 text-center ">' +
												'<!-- <h1>任务详情</h1> -->' +
												'<div id="ongoing_tasks_19_div" class="bootstarp4 row">' +
												'<div class="bootstarp4 col-3">' +
												'<img style="max-width: 100%;max-width: 100%;"' +
												'src="https://wx1.sinaimg.cn/large/006wvbvUly1g3dn2lgc4ij32yo1o0npf.jpg">' +
												'</div>' +
												'<div class="bootstarp4 col-9">' +
												'<a href="' + href + '">' +
												'[' + type + ']' + response.data.task_name +
												'</a> <span>(人气: <a' +
												'href="http://i.pcbeta.com/home.php?mod=task&amp;do=view&amp;id=119#parter">1451970</a>' +
												')</span>' +
												'<p>' + response.data.mission_statement + '</p>' +
												'<div class="bootstarp4 progress">' +
												'<div class="bootstarp4 progress-bar" role="progressbar" style="width: 50%"' +
												'aria-valuemax="100">50%</div>' +
												'</div>' +
												'</div>' +
												'</div>' +
												'<h3>奖励</h3>' +
												'<table class="bootstarp4 table">' +
												'<tr class="bootstarp4 active">' +
												'<td>' + response.data.award_name + '</td>' +
												'<td>' + response.data.number + '</td>' +
												'</tr>' +
												'</table>' +
												'<br>' +
												'<div>' +
												'<tr>' +
												'<h1 class="bbda">申请此任务所需条件</h1>' +
												'<td class="bbda">' +
												'<ul>' +
												'<li>用户组: ';
											response.data.livel_name_list.forEach(value => {
												html += '<a href="http://baidu.com">' + value[0].level_name + '</a>、';

											});
											html = html.substr(0, html.length - 1); // 删除多余的 、
											html += '</li>' +
												'</ul>' +
												'</td>' +
												'</tr>' +
												'</div>' +
												'<br>' +
												'<div>' +
												'<p>已有' +
												'<code class="highlighter-rouge">' + response.data.task_number + '</code>人参加了' +
												'</p>' +
												'<div class="bootstrap4 bd-example bd-example-images">' +
												'<div class="bootstarp4 row">';
											response.data.task_number_info.forEach(value => {
												if (value.nickname) {
													var user_name = value.nickname;
												} else {
													var user_name = value.user_name;
												}
												html += '<div class="bootstarp4 col-2 m-auto">' +
													'<img onclick="user_info(' + value.id + ')" class="bootstrap4 ' +
													'rounded float-left" alt="' + user_name + '"' +
													' src="' + value.head_src + '"' +
													'data-holder-rendered="true"' +
													'style="max-width: 100%; max-height: 100%;">' +
													'<p onclick="user_info(' + value.id + ')">' + user_name + '</p>'
												'</div>';
											});
											html += '</div>' +
												'</div>' +
												'</div>' +
												'</div>';
											$('#task-info').empty();
											$('#task-info').append(html);

										}
									});

								}

								function Reward(id) {
									$.ajax({
										type: "POST",
										url: "{:url('task_index_reward')}",
										data: {
											id: id
										},
										dataType: "JSON",
										success: function (response) {
											if (response.code == 0) {
												$html = $('#ongoing_tasks_' + id + '_div').html();
												$html = '<div id="completed-tasks_' + id + '_div"  class="bootstarp4 row">' +
													$html +
													'</div></br>';

												$html = $html.replace(/<button(.*?)button>/, '');
												$html = $html.replace('style="width: 50%"', 'style="width: 100%"');
												$html = $html.replace('bg-info', 'bg-success');
												$html = $html.replace(' aria-valuemax="100"></div>',
													' aria-valuemax="100">100%</div>');
												$('#ongoing_tasks_' + id + '_div').remove();
												$('#completed-tasks').append($html);
												alert('领取成功');
											} else {
												$html = $('#ongoing_tasks_' + id + '_div').remove();
												alert('领取失败');
											}
										},
										error: function () {
											alert('发生未知错误')
										}
									});
								}

								function receiving_tasks(id) {

									html = $('#ongoing-tasks').html();
									$.ajax({
										type: "POST",
										url: "{:url('bbs/task/task_index_receiving_tasks')}",
										data: {
											id: id
										},
										dataType: "json",
										success: function (response) {
											if (response.code == 0) {
												href = $('#mission_unanswere_' + id + '_href').attr('href');
												$html = $('#mission_unanswere_' + id + '_div').html();
												$html = '<div id="ongoing_tasks_' + id + '_div"  class="bootstarp4 row">' + $html +
													'</div></br>';
												$html = $html.replace('领取任务', '执行任务');
												$html = $html.replace('style="width: 0%"', 'style="width: 50%"');
												$html = $html.replace(' aria-valuemax="100"></div>',
													' aria-valuemax="100">50%</div>');
												$html = $html.replace('receiving_tasks(\'' + id + '\')', "window.location.href='" +
													href + "'");
												$('#mission_unanswere_' + id + '_div').remove();
												$('#ongoing-tasks').append($html);
												alert('申请成功');
											} else {
												alert('申请失败');
											}
										}
									});
								}

								function integral_query() {
									$.ajax({
										type: "POST",
										url: "{:url('bbs/task/task_index_integral_query')}",
										data: "data",
										dataType: "json",
										success: function (response) {
											html = '<table class="bootstarp4 table">' +
												'<thead>' +
												'<tr>' +
												'<th scope="col">id</th>' +
												'<th scope="col">经验</th>' +
												'<th scope="col">积分</th>' +
												'<th scope="col">说明</th>' +
												'<th scope="col">总经验</th>' +
												'<th scope="col">总积分</th>' +
												'</tr>' +
												'</thead>' +
												'<tbody>';
											response.data.list.forEach((value, key) => {
												switch (value.reward_or_punishment) {
													case 0: // 奖/惩
														if (value.download_currency || value.integral) {
															if (value.download_currency) {
																html += '<tr class="bootstarp4 ">';
															} else {
																html += '<tr class="bootstarp4 bg-info">';
															}
														} else {
																html += '<tr class="bootstarp4 bg-primary">';
															//获得的数据没有奖励也没有惩罚
														}
														break;
													case 1: // 奖/惩
														if (value.download_currency || value.integral) {
															if (value.download_currency) {
																html += '<tr class="bootstarp4 bg-danger">';
															} else {
																html += '<tr class="bootstarp4 bg-warning">';
															}
														} else {
																html += '<tr class="bootstarp4 bg-primary">';
															//获得的数据没有奖励也没有惩罚
														}
														break;

													default:
														break;
												}
												html += '<th scope="row">' + key + '</th>' +
													'<td>' + value.integral + '</td>' +
													'<td>' + value.download_currency + '</td>' +
													'<td>' + value.info + '</td>' +
													'<td>' + value.integral_count + '</td>' +
													'<td> ' + value.download_currency_count + '</td>' +
													'</tr>';
											});

											html += '</tbody>' +
												'</table>';
											$('#Integral-query').empty();
											$('#Integral-query').append(html);
										}
									});

								}
							</script>



							<!-- <h5 class="bootstarp4 card-title">任务</h5>
							<p class="bootstarp4 card-text">With supporting text below as a natural lead-in to
								additional
								content.
							</p>
							<a href="#" class="bootstarp4 btn btn-primary">Go somewhere</a> -->
						</div>
						<div class="bootstarp4 tab-pane fade" id="task-info" role="tabpanel"
							aria-labelledby="task-info-tab">
							<h1>进入方法不对哦</h1>
						</div>
						<div class="bootstarp4 tab-pane fade" id="Integral-query" role="tabpanel"
							aria-labelledby="Integral-query-tab">
							<!-- <h5 class="bootstarp4 card-title">积分查询</h5> -->
							<table class="bootstarp4 table table-striped">
								<thead>
									<tr>
										<th scope="col">#</th>
										<th scope="col">First</th>
										<th scope="col">Last</th>
										<th scope="col">Handle</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<th scope="row">1</th>
										<td>Mark</td>
										<td>Otto</td>
										<td>@mdo</td>
									</tr>
									<tr>
										<th scope="row">2</th>
										<td>Jacob</td>
										<td>Thornton</td>
										<td>@fat</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>




	<!-- <div class="bootstarp4 ">
		<div class="bootstarp4 wrap">
			<div class="bootstarp4 row">
				<div class="bootstarp4 col-4">

					<div class="bootstarp4 list-group" id="list-tab" role="tablist">
						<a class="bootstarp4 list-group-item list-group-item-action active" id="list-home-list" data-toggle="list"
							href="#list-home" role="tab" aria-controls="home">Home</a>
						<a class="bootstarp4 list-group-item list-group-item-action" id="list-task-info-list" data-toggle="list"
							href="#list-task-info" role="tab" aria-controls="task-info">task-info</a>
						<a class="bootstarp4 list-group-item list-group-item-action" id="list-messages-list" data-toggle="list"
							href="#list-messages" role="tab" aria-controls="messages">Messages</a>
						<a class="bootstarp4 list-group-item list-group-item-action" id="list-settings-list" data-toggle="list"
							href="#list-settings" role="tab" aria-controls="settings">Settings</a>
					</div>
				</div>
				<div class="bootstarp4 col-8">
					<div class="bootstarp4 tab-content" id="nav-tabContent">
						<div class="bootstarp4 tab-pane fade show active" id="list-home" role="tabpanel"
							aria-labelledby="list-home-list">1</div>
						<div class="bootstarp4 tab-pane fade" id="list-task-info" role="tabpanel"
							aria-labelledby="list-task-info-list">2</div>
						<div class="bootstarp4 tab-pane fade" id="list-messages" role="tabpanel"
							aria-labelledby="list-messages-list">3</div>
						<div class="bootstarp4 tab-pane fade" id="list-settings" role="tabpanel"
							aria-labelledby="list-settings-list">4</div>
					</div>
				</div>
			</div>
		</div>
	</div> -->


</body>

</html>